{% from 'macros/icon.njk' import icon with context %}
{% from 'macros/project-icon.njk' import projectIcon with context %}

{% macro featuredDocsCard(projects) %}
<div class="featured-card hairline rounded-lg width-full">
  <div class="card-title-bar color-blue-medium">
    {{ icon('docs', {hidden: true}) }}
    <span class="gap-left-300 flex-1 user-select-none">
      {{ 'i18n.nav.side_nav.docs' | i18n(locale) }}
    </span>
  </div>

  <div class="display-grid grid-cols-2 grid-gap-300 lg:grid-gap-500 gap-top-400">
    {% for item in projects %}
      {# Find the landing page for the project itself and grab its metadata #}
      {% set projectUrl = helpers.join('/docs', item) %}
      {% set project = helpers.findByUrl(collections.all, projectUrl, locale) %}
      {# Don't render an empty link if a project is disabled via a build flag #}
      {% if project %}
        <a class="project-card project-card--sm" href="{{ projectUrl }}">
          {{ projectIcon(item) }}
          <h3 class="project-card__title type--cta">{{project.data.title}}</h1>
        </a>
      {% endif %}
    {% endfor %}
  </div>

  <div class="gap-top-400">
    <a href="/docs/" class="material-button button-text display-inline-flex color-primary">
      {{ 'i18n.common.see_all_docs' | i18n(locale) }}
    </a>
  </div>
</div>
{% endmacro %}
